<form nz-form>

  <div>
    <!-- 用户信息 -->
    <div>
      <h3>用户信息</h3>
      <div nz-row [nzGutter]="8">
        <div nz-col [nzSpan]="4">
          <label>用户名:</label>
        </div>
        <div nz-col [nzSpan]="10">
          <span>{{auditLog.userName}}</span>
        </div>
      </div>
      <div nz-row [nzGutter]="8">
        <div nz-col [nzSpan]="4">
          <label>IP地址:</label>
        </div>
        <div nz-col [nzSpan]="10">
          <span>{{auditLog.clientIpAddress}}</span>
        </div>
      </div>
      <div nz-row [nzGutter]="8">
        <div nz-col [nzSpan]="4">
          <label>客户端:</label>
        </div>
        <div nz-col [nzSpan]="10">
          <span>{{auditLog.clientName}}</span>
        </div>
      </div>
      <div nz-row [nzGutter]="8">
        <div nz-col [nzSpan]="4">
          <label>浏览器:</label>
        </div>
        <div nz-col [nzSpan]="10">
          <span>{{auditLog.browserInfo}}</span>
        </div>
      </div>
    </div>

    <!-- 操作信息 -->
    <div>
      <h3>操作信息</h3>
      <div nz-row [nzGutter]="8">
        <div nz-col [nzSpan]="4">
          <label>服务:</label>
        </div>
        <div nz-col [nzSpan]="10">
          <span>{{auditLog.serviceName}}</span>
        </div>
      </div>
      <div nz-row [nzGutter]="8">
        <div nz-col [nzSpan]="4">
          <label>方法:</label>
        </div>
        <div nz-col [nzSpan]="10">
          <span>{{auditLog.methodName}}</span>
        </div>
      </div>
      <div nz-row [nzGutter]="8">
        <div nz-col [nzSpan]="4">
          <label>时间:</label>
        </div>
        <div nz-col [nzSpan]="10">
          <span>{{getExecutionTime()}}</span>
        </div>
      </div>
      <div nz-row [nzGutter]="8">
        <div nz-col [nzSpan]="4">
          <label>持续时间:</label>
        </div>
        <div nz-col [nzSpan]="10">
          <span>{{auditLog.executionDuration}}ms</span>
        </div>
      </div>
      <div nz-row [nzGutter]="8">
        <div nz-col [nzSpan]="4">
          <label>参数:</label>
        </div>
        <div nz-col [nzSpan]="20">
          <pre lang="js">{{getFormattedParameters()}}</pre>
        </div>
      </div>
    </div>

<!-- 自定义数据 -->
<div>
<h3>自定义数据</h3>
  <div nz-row [nzGutter]="8">
    <div nz-col [nzSpan]="8">
      <label>没有数据</label>
    </div>
    <div nz-col [nzSpan]="10">
      <span>{{auditLog.customData}}</span>
    </div>
  </div>
</div>

<!-- 错误状态 -->
<div>
  <h3>状态</h3>
  <div nz-row [nzGutter]="8">
    <div nz-col [nzSpan]="4">
      <nz-badge *ngIf="auditLog.exception " [nzStatus]="'error'" [nzText]="'错误'"></nz-badge>
      <nz-badge *ngIf="!auditLog.exception " [nzStatus]="'success'" [nzText]="'成功'"></nz-badge>
    </div>
  </div>
</div>

  </div>

</form>
